function addTag(basePath,type){
	var node=document.getElementById(type+'Tags').parentNode;
	var tagNameElements=node.getElementsByTagName('input');
	var tagName=tagNameElements[tagNameElements.length-1].value;
	coolio.xhrGet({
		url: basePath+'tag/add_tag',
   		handleAs: "json",
   		content: {
   			tag: tagName
	    },
		handle:function(data){
			var tagId=data;
			insert_tag(type,tagId,tagName);
		},
		error: function(response, ioArgs){
	    	alert("xhr get failed:");
		    return response;
		}
	});
}

function insert_tag(type,tagId,tagName){
	var node=document.getElementById(type+'Tags').parentNode;
	var tagNameElements=node.getElementsByTagName('input');
	node.getElementsByTagName('input')[tagNameElements.length-1].value="";
	
	if(!document.getElementById(type+'Tag'+tagId)){
		var newTag=document.createElement('span');
		newTag.id=type+"Tag"+tagId;
		newTag.innerHTML=tagName+"&nbsp;<input type='hidden' name='"+type+"Ids' value='"+tagId+"'/><img src='../image/cancel.png' onclick='this.parentNode.parentNode.removeChild(this.parentNode);'/>";
		node.insertBefore(newTag,node.getElementsByTagName('span')[0]);
	}
}

function get_tags(basePath,textfield,type){
	var prefix=textfield.value;
	if(prefix!=''){
		coolio.xhrGet({
			url: basePath+'tag/get_tags',
	   		handleAs: "json",
	   		content: {
	   			prefix: prefix
		    },
			handle:function(data){
				var div=document.getElementById('hintsDiv');
				var table=document.createElement('table');
				table.width='100px';
				
				for(var i=0;i<data.length;i++){
					var tr=document.createElement('tr');
					var td=document.createElement('td');
					var func="insert_tag('"+type+"','"+data[i].id+"','"+data[i].name+"');document.getElementById('hintsDiv').style.display='none';";
					td.innerHTML='<input type="button" value="'+data[i].name+'" onclick="'+func+'"/>';
					tr.appendChild(td);
					table.appendChild(tr);
				}
				
				for(var i=0;i<div.childNodes.length;i++){
					div.removeChild(div.childNodes[i]);
				}
				
				div.appendChild(table);
				div.style.display='';
				
				var pos=getElementPos(textfield);
				div.style.left=(pos.x)+'px';
				div.style.top=(pos.y+18)+'px';
			},
			error: function(response, ioArgs){
		    	alert("xhr get failed:");
			    return response;
			}
		});
	}else{
		document.getElementById('hintsDiv').style.display='none';
	}
}

function getElementPos(el) {
	var ua = navigator.userAgent.toLowerCase();
	var isOpera = (ua.indexOf('opera') != -1);
	var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof
	if(el.parentNode === null || el.style.display == 'none') {
	  return false;
	}     
	var parent = null;
	var pos = [];    
	var box;    
	if(el.getBoundingClientRect)    //IE
	{         
	   box = el.getBoundingClientRect();
	   var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
	   var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
	  return {x:box.left + scrollLeft, y:box.top + scrollTop};
	}else if(document.getBoxObjectFor)    // gecko   
	{
	   box = document.getBoxObjectFor(el);
	   var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0;
	   var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0;
	   pos = [box.x - borderLeft, box.y - borderTop];
	} else    // safari & opera   
	{
	   pos = [el.offsetLeft, el.offsetTop];
	   parent = el.offsetParent;    
	   if (parent != el) {
	    while (parent) {
	     pos[0] += parent.offsetLeft;
	     pos[1] += parent.offsetTop;
	     parent = parent.offsetParent;
	    }
	   }  
	   if (ua.indexOf('opera') != -1 || ( ua.indexOf('safari') != -1 && el.style.position == 'absolute' )) {
	    pos[0] -= document.body.offsetLeft;
	    pos[1] -= document.body.offsetTop;        
	   }   
	}             
	if (el.parentNode) {
	   parent = el.parentNode;
	} else {
	   parent = null;
	}
	while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML') { // account for any scrolled ancestors
	   pos[0] -= parent.scrollLeft;
	   pos[1] -= parent.scrollTop;
	   if (parent.parentNode) {
	    parent = parent.parentNode;
	   } else {
	    parent = null;
	   }
	}
	return {x:pos[0], y:pos[1]};
}